/* eslint-disable */
import * as d3 from '../../../static/js/d3.v3.min.js'
import * as api from '../../api/entdetail.js'
export const TreeChart = {
  drawChart(box, data) {
    let div = box.id
    let width = box.width
    let height = box.height
    let treeData = {}
    let allData = data
    var downwardLength = 0
    var upwardLength = 0
    var rootName = '';//根节点的名字
    var rootRectWidth = 0;//根节点rect的宽度
    this.directions = ['upward', 'downward']
    this.directions.forEach(function (direction) {
      treeData[direction] = allData[direction]
    })
    rootName = data.downward.name;
    rootRectWidth = rootName.length * 18;
    //获得upward第一级节点的个数
    upwardLength = allData.upward.children ? allData.upward.children.length : 0
    //获得downward第一级节点的个数
    downwardLength = allData.downward.children ? allData.downward.children.length : 0
    function getTreeConfig() {
      var treeConfig = { 'margin': { 'top': 10, 'right': 5, 'bottom': 0, 'left': 30 } }
      // This will be the maximum dimensions
      treeConfig.chartWidth = (width - treeConfig.margin.right - treeConfig.margin.left);
      treeConfig.chartHeight = (height - treeConfig.margin.top - treeConfig.margin.bottom);
      treeConfig.centralHeight = treeConfig.chartHeight / 2;
      treeConfig.centralWidth = treeConfig.chartWidth / 2;
      treeConfig.linkLength = 120;
      treeConfig.duration = 200;
      return treeConfig
    }
    let getTreeConfigs = getTreeConfig()
    var self = this;
    graphTree(getTreeConfigs)
    function graphTree(config) {
      var linkLength = config.linkLength;
      var duration = config.duration;
      var hasChildNodeArr = [];
      var id = 0;
      var diagonal = d3.svg.diagonal()
        .projection(function (d) {
          return [d.x, d.y]
          //  + 5
        });
      var zoom = d3.behavior.zoom()
        .scaleExtent([0.8, 2])
        .on('zoom', redraw);
      var svg = d3.select(div)
        .append('svg')
        .attr('width', config.chartWidth + config.margin.right + config.margin.left)
        .attr('height', config.chartHeight + config.margin.top + config.margin.bottom)
        .on('mousedown', disableRightClick)
        .call(zoom)
        .on('dblclick.zoom', null);
      var treeG = svg.append('g')
        .attr('transform', 'translate(' + config.margin.left + ',' + config.margin.top + ')');
      let divbox = d3.select('.chartTooltip').style("opacity", 0)
      //箭头(下半部分)
      var markerDown = svg.append("marker")
        .attr("id", "resolvedDown")
        .attr("markerUnits", "strokeWidth")//设置为strokeWidth箭头会随着线的粗细发生变化
        .attr("markerUnits", "userSpaceOnUse")
        .attr("viewBox", "0 -5 10 10")//坐标系的区域
        .attr("refX", 0)//箭头坐标 5
        .attr("refY", 0)
        .attr("markerWidth", 12)//标识的大小
        .attr("markerHeight", 12)
        .attr("orient", "90")//绘制方向，可设定为：auto（自动确认方向）和 角度值
        .attr("stroke-width", 1)//箭头宽度
        .append("path")
        .style('fill-opacity', 1)
        .attr("d", "M0,-5L10,0L0,5")//箭头的路径
        // .attr('d', 'M0,-5L10,0L0,5L5,0')
        .attr('fill', function(d) {
          return '#000'
        });//箭头颜色
      //箭头(上半部分)
      var markerUp = svg.append("marker")
        .attr("id", "resolvedUp")
        .attr("markerUnits", "strokeWidth")//设置为strokeWidth箭头会随着线的粗细发生变化
        .attr("markerUnits", "userSpaceOnUse")
        .attr("viewBox", "0 -5 10 10")//坐标系的区域
        .attr("refX", 10)//箭头坐标
        .attr("refY", 0)
        .attr("markerWidth", 12)//标识的大小
        .attr("markerHeight", 12)
        .attr("orient", "90")//绘制方向，可设定为：auto（自动确认方向）和 角度值
        .attr("stroke-width", 2)//箭头宽度
        .append("path")
        .style('fill-opacity', 1)
        .attr("d", "M0,-5L10,0L0,5")//箭头的路径
        // .attr('d', 'M0,-5L10,0L0,5L5,0')
        .attr('fill', '#000');//箭头颜色
      // Initialize the tree nodes and update chart.
      for (var d in self.directions) {
        var direction = self.directions[d];
        var data = treeData[direction];
        data.x0 = config.centralWidth;
        data.y0 = config.centralHeight;
        // Hide all children nodes other than direct generation.
        if (data.children) {
          data.children.forEach(collapse);
        }
        update(data, data, treeG);
      }

      /**
       * Update nodes and links based on direction data.
       * @param {Object} source Object for current chart distribution to identify
       *    where the children nodes will branch from.
       * @param {Object} originalData Original data object to get configurations.
       * @param {Object} g Handle to svg.g.
       */
      function update(source, originalData, g) {
        // Set up the upward vs downward separation.
        var direction = originalData['direction'];
        var forUpward = direction == 'upward';
        var node_class = direction + 'Node';
        var link_class = direction + 'Link';
        var downwardSign = (forUpward) ? -1 : 1;
        var nodeColor = (forUpward) ? '#37592b' : '#8b4513';
        var isExpand = false;
        var isExpand2 = false;
        var statusUp = true;
        var statusDown = true;
        // Reset tree layout based on direction, since the downward chart has
        // way too many nodes to fit in the screen, while we want a symmetric
        // view for upward chart.
        var nodeSpace = 150;
        // 盒子间的距离
        var tree = d3.layout.tree().sort(sortByDate).nodeSize([nodeSpace, 0]);
        /* if (forUpward) {
          tree.size([config.chartWidth, config.chartHeight]);//树图定宽
        } */
        var nodes = tree.nodes(originalData);
        var links = tree.links(nodes);
        // Offset x-position for downward to view the left most record.
        var offsetX = -config.centralWidth;
        //向一边发展的树杈
        /* if (!forUpward) {
          var childrenNodes = originalData[(originalData.children) ? 'children' : '_children'];
          offsetX = d3.min([childrenNodes[0].x, 0]);
        } */
        // Normalize for fixed-depth.
        nodes.forEach(function (d) {
          d.y = downwardSign * (d.depth * linkLength) + config.centralHeight;
          d.x = d.x - offsetX;
          // Position for origin node.
          if (d.name == rootName) {
            d.x = config.centralWidth;
            d.y += downwardSign * 0;// 上下两树图根节点之间的距离
          }
        });

        // Update the node.
        var node = g.selectAll('g.' + node_class)
          .data(nodes, function (d) {
            return d.id || (d.id = ++id);
          });
        // Enter any new nodes at the parent's previous position.
        var nodeEnter = node.enter().append('g')
          .attr('class', node_class)
          .attr('transform', function (d) {
            return 'translate(' + source.x0 + ',' + source.y0 + ')';
          })
          // .style('cursor', function (d) {
          //   return (d.name == rootName) ? '' : (d.children || d._children) ? 'pointer' : '';
          // })
          // .on('click', click);
        // 大方块
        let rect = nodeEnter
          .append('g')
          .classed('rect-wrap', true)
          .style('cursor', function (d) {
            return (d.name == rootName) ? 'default' : (d.isRisk && d.isRisk === 'true' && d.name !== rootName) ? 'pointer' : 'default';
          })
        // 方块内图以及字
        rect.append("svg:rect")
        // nodeEnter.append("svg:rect")
          .attr("x", function (d) {
            return (d.name == rootName) ? -(rootRectWidth / 2) : -60;
          })
          .attr("y", function (d) {
            return (d.name == rootName) ? -20 : forUpward ? -52 : 12;
          })
          .attr("width", function (d) {
            return (d.name == rootName) ? rootRectWidth : 122;
          })
          .attr("height", 40)
          .attr("rx", function() {
            return (d.name === rootName) ? 10 : 2
          })
          .style("stroke", function (d) {
            if (d.name === rootName) {
              return '#1F61E5'
            }
            return '#D9D9D9'
          })
          .style("fill", function (d) {
            return (d.name == rootName) ? "#46A2D2" : "#fff";
          })
          .style('fill-opacity', function (d) {
            return (d.name !== rootName) ? 1 : 0.8
          });
        // 下划线
        rect.append("svg:rect")
        // nodeEnter.append("svg:rect")
          .attr("x", function (d) {
            return (d.name == rootName) ? -(rootRectWidth / 2) : -60;
          })
          .attr("y", function (d) {
            return (d.name == rootName) ? -20 + 38 : forUpward ? -52 + 38 : 12 + 38;
          })
          .attr("width", function (d) {
            return (d.name == rootName) ? rootRectWidth : 122;
          })
          .attr("height", function() {
            return (d.name == rootName) ? 0 : 2;
          })
          .style("stroke", function (d) {
            if (d.isRisk && d.isRisk === 'true' && d.name !== rootName) {
              return '#EB8686'
            }
            return (d.name == rootName) ? "none" : "#96EE96";
          })
          .style("fill", function (d) {
            if (d.isRisk && d.isRisk === 'true' && d.name !== rootName) {
              return '#EB8686'
            }
            return (d.name == rootName) ? "none" : "#96EE96";
          })
        // 圆圈
        // let circlebox = nodeEnter.append('g')
        //   .attr('transform', function (d) {
        //     return 'translate(' + source.x0 + ',' + source.y0 + ')';
        //   })
        // circlebox.append('circle')
        //   .attr('r',1e-6)
        // 圆圈
        let circle = nodeEnter
          .append('g')
          .classed('circle-wrap', true)
          .style('cursor', function (d) {
            return (d.name == rootName) ? 'default' : (d.children || d._children) ? 'pointer' : 'default';
          })
        circle
          .append('circle')
          .attr('r', 1e-6)
        // Add Text stylings for node main texts
        // 第一行字
        rect.append('text')
        // nodeEnter.append('text')
          .attr("class", "linkname")
          .attr("x", function (d) {
            return (d.name == rootName) ? '0' : "-55";
          })
          .attr('dy', function (d) {
            //  + 5
            return (d.name == rootName) ? '.35em' : forUpward ? '-35' : '29';
          })
          .attr("text-anchor", function (d) {
            return (d.name == rootName) ? 'middle' : "start";
          })
          .text(function (d) {
            // Text for origin node.
            if (d.name == rootName) {
              return rootName;
            }
            // Text for summary nodes.
            if (d.repeated) {
              return '[Recurring] ' + d.name;
            }
            let userAgent = navigator.userAgent
            if (userAgent.indexOf("Chrome") > -1) {
              return (d.name.length > 9 && d.name !== rootName) ? d.name.substr(0, 9) : d.name;
            } else {
              return (d.name.length > 8 && d.name !== rootName) ? d.name.substr(0, 8) : d.name;
            }
          })
          .style({
            // 'fill-opacity': 1e-6,
            'fill': function (d) { if (d.name == rootName) { return '#fff'; } else { return '#333333' } },
            'font-size': function (d) { return (d.name === rootName) ? 16 : 12; },
            'cursor': function (d) {return (d.name !== rootName && d.isRisk && d.isRisk === 'true') ? "pointer" : 'default'}
          });
        // 第二行字
        rect.append("text")
        // nodeEnter.append("text")
          .attr("class", "linkname")
          .attr("x", "-55")
          .attr("dy", function (d) {
            // +5
            return (d.name == rootName) ? '.35em' : forUpward ? '-21' : '43';
          })
          .attr("text-anchor", function () {
            return (d.name == rootName) ? 'middle' : "start";
          })
          .text(function (d) {
            if (d.name == rootName) {
              return '';
            }
            let userAgent1 = navigator.userAgent
            if (userAgent1.indexOf("Chrome") > -1) {
              return (d.name.length - 9 > 9) ? d.name.substr(9, 8) + '...' : d.name.substr(9);
            } else {
              return (d.name.length - 8 > 8) ? d.name.substr(8, 7) + '...' : d.name.substr(8);
            }
          })
          .style({
            'fill': "#333333",
            'font-size': function (d) { return (d.name == rootName) ? 16 : 12; },
            'cursor': function (d) {return (d.name !== rootName && d.isRisk && d.isRisk === 'true') ? "pointer" : 'default'}
          });
        // 关系1
        nodeEnter.append("text")
          .attr("x", "12")
          .attr("dy", function (d) {
            return (d.name == rootName) ? '.35em' : forUpward ? '0' : '7';
          })
          .attr("text-anchor", "start")
          .attr("class", "linkname")
          .style("fill", "#008052")
          .style('font-size', 12)
          .style('cursor', 'default')
          .text(function (d) {
            if (d.Category === 4) {
              let userAgent = navigator.userAgent
              if (userAgent.indexOf("Chrome") > -1) {
                return (d.Shortname.length > 10) ? d.Shortname.substr(0, 10) : d.Shortname;
              } else {
                return (d.Shortname.length > 8) ? d.Shortname.substr(0, 8) : d.Shortname;
              }
              // return d.Shortname
            }
            if (d.Category === 3) {
              return '股东'
            }
            return (d.name == rootName) ? "" : "对外投资"
          });
        // 关系2
        nodeEnter.append("text")
        .attr("x", "12")
        .attr("dy", function (d) {
          if (d.Category === 4) {
            let userAgent = navigator.userAgent
            if (userAgent.indexOf("Chrome") > -1) {
              return '12'
            } else {
              return '14'
            }
          }
        })
        .attr("text-anchor", "start")
        .attr("class", "linkname")
        .style("fill", "#008052")
        .style('font-size', 12)
        .style('cursor', 'default')
        .text(function (d) {
          if (d.Category === 4) {
            let userAgent = navigator.userAgent
            if (userAgent.indexOf("Chrome") > -1) {
              return (d.Shortname.length - 10 > 10) ? d.Shortname.substr(10, 9) + '...' : d.Shortname.substr(10);
            } else {
              return (d.Shortname.length - 8 > 8) ? d.Shortname.substr(8, 7) + '...' : d.Shortname.substr(8);
            }
          }
        });
        // 持股比例   暂无该数据
        nodeEnter.append("text")
          .attr("x", "-55")
          .attr("dy", function (d) {
            return (d.name == rootName) ? '.35em' : forUpward ? '-16' : '48';
          })
          .attr("text-anchor", "start")
          .attr("class", "linkname")
          .style("fill", "#fff")
          .style('cursor', 'default')
          .style('font-size', 10)
          .text(function (d) {
            // var str = (d.name == rootName) ? '' : "认缴金额:1000万人民币";
            // return (str.length > 13) ? str.substr(0, 13) + ".." : str;
            return ''
          });

        // Transition nodes to their new position.原有节点更新到新位置
        var nodeUpdate = node.transition()
          .duration(duration)
          .attr('transform', function (d) {
            return 'translate(' + d.x + ',' + d.y + ')';
          });
        nodeUpdate.select('circle')
          .attr('r', function (d) {
            return (d.name == rootName) ? 0 : (hasChildNodeArr.indexOf(d) == -1) ? 0 : 6;
          })
          .attr('cy', function (d) {
            return (d.name == rootName) ? -20 : (forUpward) ? -59 : 59;
          })
          .style('fill', function (d) {
            // return hasChildNodeArr.indexOf(d) != -1 ? "#fff" : "";
            if (d._children || d.children) { return "#65A1EA"; } else { return "rgba(0,0,0,0)"; }
          })
          .style('stroke', function (d) {
            // return hasChildNodeArr.indexOf(d) != -1 ? "#8b4513" : "";
            if (d._children || d.children) { return "#65A1EA"; } else { return "rgba(0,0,0,0)"; }
          })
          .style('fill-opacity', function (d) {
            if (d._children || d.children) {
              return 0.8
            } else {
              return 0
            }
          })
          // Setting summary node style as class as mass style setting is
          // not compatible to circles.
          .style('stroke-width', function (d) {
            // if (d.repeated) { return 5; }
            return 1
          });
        //代表是否展开的+-号
        let expands = circle.append("svg:text")
          .attr("class", "isExpand")
          .attr("x", "0")
          .attr("dy", function (d) {
            if (d.name == rootName) {
              return '';
            }
            return forUpward ? -54 : 64;
          })
          .attr("text-anchor", "middle")
          .style("fill", "#fff")
          .style('font-size', 16)
          .text(function (d) {
            if (d.name == rootName) {
              return '';
            }
            return hasChildNodeArr.indexOf(d) != -1 ? "+" : "";
          });
        rect.on('click', function (d) {
          let detailHref = ''
          let params = {
            entName:d.name
          }
          if (d.KeyNo && typeof d.KeyNo !== undefined) {
            params.entId = d.KeyNo
          }
          let parentname = d.parentname
          api.getBusinessInfobase(params).then(res => {
            let names = res.data.entName
            if (d.name !== rootName && d.isRisk && d.isRisk === 'true') {
              if (parentname && typeof parentname !== undefined) {
                detailHref =
                  'http://' +
                  location.host +
                  '#/entdetail/baseinfo?entname=' +
                  names + '&parentName=' + parentname
              } else {
                detailHref =
                  'http://' +
                  location.host +
                  '#/entdetail/baseinfo?entname=' +
                  names
              }
              window.open(detailHref, "_blank")
            }
          }).catch(err => {
            console.log(err)
          })
        });
        circle.on('click', click)
        nodeUpdate.select('text').style('fill-opacity', 1)

        //最终受益人 start//
        //提示框
        var tsk = nodeEnter.append("svg:rect")
          .attr("x", -60)
          .attr("y", function (d) {
            return forUpward ? -86 : -20;
          })
          .attr("width", function (d) {
            if (d.name == rootName) {
              return 0
            } else {
              // return d.hasHumanholding ? 120 : 0;//如果有最终受益人
              return 0
            }
          })
          .attr("height", 20)
          .style("stroke", function (d) {
            return "#1078AF";
          })
          .style("fill", function (d) {
            return "#46A2D2";
          })
          .style('cursor', 'default')
        //三角形
        nodeEnter.append("svg:path")
          .attr("fill", "#1078AF")
          .attr("d", function (d) {
            if (d.name == rootName) {
              return ""
            } else {
              return d.hasHumanholding ? (forUpward ? "M-60 -66 L-40 -66 L-50 -52 Z" : "M-60 0 L-40 0 L-50 12 Z") : "";//如果有最终受益人
            }
          })
          .style('cursor', 'default')
        nodeEnter.append("svg:text")
          .attr("x", "-58")
          .attr("dy", function (d) {
            return forUpward ? "-73" : "-7";
          })
          .attr("text-anchor", "start")
          .style("fill", "#fff")
          .style("font-size", 10)
          .style('cursor', 'default')
          .text(function (d) {
            var str = ("我是最终受益人").length > 6 ? ("我是最终受益人").substr(0, 6) + ".." : ("我是最终受益人");
            // return d.hasHumanholding ? "最终受益人:" + str : "";//如果有最终受益人
            return ''
          });
        //最终受益人 end//

        // Transition exiting nodes to the parent's new position.
        var nodeExit = node.exit().transition()
          .duration(duration)
          .attr('transform', function (d) {
            return 'translate(' + source.x + ',' + source.y + ')';
          })
          .remove();
        nodeExit.select('circle')
          .attr('r', 1e-6)
        nodeExit.select('text')
          .style('fill-opacity', 1e-6);

        // Update the links.
        var link = g.selectAll('path.' + link_class)
          .data(links, function (d) { return d.target.id; });

        // Enter any new links at the parent's previous position.
        link.enter().insert('path', 'g')
          .attr('class', link_class)
          .attr('fill', 'none')
          .attr('stroke', '#37592b')
          .attr('stroke-width', '1px')
          .attr('opacity', 0.5)
          .attr('d', function (d) {
            // let o
            // if (forUpward) {
            //   o = { x: source.x0, y: source.y0 - 5 }
            // } else {
            //   o = { x: source.x0, y: source.y0 + 5 }
            // }
            var o = { x: source.x0, y: source.y0 };
            return diagonal({ source: o, target: o });
          })
          .attr("marker-end", function (d) {
            return forUpward ? "url(#resolvedUp)" : "url(#resolvedDown)";
          })//根据箭头标记的id号标记箭头;
          .attr("id", function (d, i) {
            return "mypath" + i;
          })
        // Transition links to their new position.
        link.transition()
          .duration(duration)
          .attr('d', diagonal);
        // Transition exiting nodes to the parent's new position.
        link.exit().transition()
          .duration(duration)
          .attr('d', function (d) {
            // let o
            // if (forUpward) {
            //   o = { x: source.x0, y: source.y0 - 5 }
            // } else {
            //   o = { x: source.x0, y: source.y0 + 5 }
            // }
            var o = { x: source.x, y: source.y };
            return diagonal({ source: o, target: o });
          })
          .remove();
        // Stash the old positions for transition.
        nodes.forEach(function (d) {
          d.x0 = d.x;
          d.y0 = d.y;
        });
        /**
         * Tree function to toggle on click.
         * @param {Object} d data object for D3 use.
         */
        function click(d) {
          divbox.style("opacity", 0)
          divbox.classed('hidden', true)
          divbox.html('')
          isExpand = !isExpand;
          if (d.name !== rootName) {
            if (forUpward) {
              if (d._children && d._children.length > 0) {
                // d3.select(this).select(".isExpand").text("-")
                if (d3.select(this).select(".isExpand").text() === '+') {
                  d3.select(this).select(".isExpand").text('-')
                  d3.select(this).select(".isExpand").attr('dy', -55)
                } else {
                  d3.select(this).select(".isExpand").text('+')
                  d3.select(this).select(".isExpand").attr('dy', -54)
                }
              } else if (d.children && d.children.length > 0) {
                // d3.select(this).select(".isExpand").text("+")
                if (d3.select(this).select(".isExpand").text() === '+') {
                  d3.select(this).select(".isExpand").text('-')
                  d3.select(this).select(".isExpand").attr('dy', -55)
                } else {
                  d3.select(this).select(".isExpand").text('+')
                  d3.select(this).select(".isExpand").attr('dy', -54)
                }
              }
            } else {
              if (d._children && d._children.length > 0) {
                // d3.select(this).select(".isExpand").text("-") // -
                if (d3.select(this).select(".isExpand").text() === '+') {
                  d3.select(this).select(".isExpand").text('-')
                  d3.select(this).select(".isExpand").attr('dy', 63)
                } else {
                  d3.select(this).select(".isExpand").text('+')
                  d3.select(this).select(".isExpand").attr('dy', 64)
                }
              } else if (d.children && d.children.length > 0) {
                // d3.select(this).select(".isExpand").text("+") // ＋
                if (d3.select(this).select(".isExpand").text() === '+') {
                  d3.select(this).select(".isExpand").text('-')
                  d3.select(this).select(".isExpand").attr('dy', 63)
                } else {
                  d3.select(this).select(".isExpand").text('+')
                  d3.select(this).select(".isExpand").attr('dy', 64)
                }
              }
            }
          }
          if (d.name == rootName) {
            return;
          }
          if (d.Shortname === '自然人股东' && d.name !== rootName) {
            let lists = [
              {
                name:'天津远卓商贸有限公司',
                people:''
              },
              {
                name:'天津开发区山焦进出口贸易有限公司',
                people:'陈思晖'
              },
              {
                name:'上海趣蕴网络科技有限公司上海基分文化传播有限公司',
                people:'李磊'
              },
              {
                name:'天津珊石科技合伙企业(有限合伙)',
                people:''
              },
              {
                name:'上海基分文化传播有限公司',
                people:'陈思晖'
              },
              {
                name:'上海趣蕴网络科技有限公司',
                people:'李磊'
              },{
                name:'天津珊石科技合伙企业(有限合伙)',
                people:''
              },
              {
                name:'上海基分文化传播有限公司',
                people:'陈思晖'
              },
              {
                name:'上海趣蕴网络科技有限公司',
                people:'李磊'
              },
              {
                name:'上海趣蕴网络科技有限公司',
                people:'李磊'
              },{
                name:'天津珊石科技合伙企业(有限合伙)',
                people:''
              },
              {
                name:'上海基分文化传播有限公司',
                people:'陈思晖'
              },
              {
                name:'上海趣蕴网络科技有限公司',
                people:'李磊'
              }
            ]
            let message = '<div class="message" style="overflow-y: hidden;"><div class="header" style="background-color: #3f8ffa;"><h3 style="height: 40px;font-size: 16px;color:#fff;font-weight:normal;padding: 0 0 0 20px;line-height: 43px;display:inline-block;">' +
              d.name + '的关联企业</h3><span style="float:right;margin:12px;color:#fff;cursor: pointer;" class="close">X</span></div><div style="overflow-y:scroll;font-size: 12px; height:320px;padding:10px 5px 10px 20px;width:90%;margin-top:20px;"><table class="table" width="100%" border="0" cellspacing="0" cellpadding="" style="height:auto;">'+
              '<thead style="background: #F2F9FC;"><th style="border: 1px solid #E4EEF6;padding: 12px 12px 12px 12px;">名称</th><th width="30%" style="border: 1px solid #E4EEF6;padding: 12px 12px 12px 12px;">法定代表人</th></thead>'
            lists.map(list => {
              list.people = list.people || '--'
              if (list.name) {
                list.name = list.name || '--'
                message += '<tr><td class="text-center overflow-hidden" style="padding: 12px 12px 12px 12px;border: 1px solid #E4EEF6;"><a target="_blank" href="http://' + location.host + '#/entdetail/baseinfo?entname=' + list.name + '">' + list.name + '</a></td><td class="text-center" style="padding: 12px 12px 12px 12px;border: 1px solid #E4EEF6;">' + list.people + '</td></tr>'
              } else {
                message += '<tr><td class="text-center overflow-hidden" style="padding: 12px 12px 12px 12px;border: 1px solid #E4EEF6;">' + list.name + '</td><td class="text-center" style="padding: 12px 12px 12px 12px;border: 1px solid #E4EEF6;">' + list.people + '</td></tr>'
              }
            })
            message += '</table></div>'
            // divbox.style("opacity", 1)
            // divbox.classed('hidden', false)
            // divbox.html(message)
            divbox.style("opacity", 0)
            divbox.classed('hidden', true)
            divbox.html('')
          } else {
            divbox.style("opacity", 0)
            divbox.classed('hidden', true)
            divbox.html('')
          }
          if (d.children) {
            d._children = d.children;
            d.children = null;
            d._children.map(child => {
              if (child.children) {
                child._children = child.children
                child.children = null
                child._children.map(child2 => {
                  if (child2.children) {
                    child2._children = child2.children
                    child2.children = null
                    child2._children.map(child3 => {
                      if (child3.children) {
                        child3._children = child3.children
                        child3.children = null
                      }
                    })
                  }
                })
              }
            })
          } else {
            d.children = d._children;
            d._children = null;
            // expand all if it's the first node
            if (d.name == rootName) { d.children.forEach(expand); }
          }
          // console.log(d)
          update(d, originalData, g);
        }
        let close = d3.select('.message .close')
        if (close[0]) {
          close.on('click', function() {
            divbox.style("opacity", 0)
            divbox.classed('hidden', true)
            divbox.html('')
          })
        }
        let treediv = d3.select(div)
        // console.log(window.scrollY)
      }
      // Collapse and Expand can be modified to include touched nodes.
      /**
       * Tree function to expand all nodes.
       * @param {Object} d data object for D3 use.
       */
      function expand(d) {
        if (d._children) {
          d.children = d._children;
          d.children.forEach(expand);
          d._children = null;
        }
      }

      /**
       * Tree function to collapse children nodes.
       * @param {Object} d data object for D3 use.
       */
      function collapse(d) {
        if (d.children && d.children.length != 0) {
          d._children = d.children;
          d._children.forEach(collapse);
          d.children = null;
          hasChildNodeArr.push(d);
        }
      }

      /**
       * Tree function to redraw and zoom.
       */
      function redraw() {
        treeG.attr('transform', 'translate(' + d3.event.translate + ')' +
          ' scale(' + d3.event.scale + ')');
      }
      /**
       * Tree functions to disable right click.
       */
      function disableRightClick() {
        // stop zoom
        if (d3.event.button == 2) {
          // console.log('No right click allowed');
          d3.event.stopImmediatePropagation();
        }
      }

      /**
       * Tree sort function to sort and arrange nodes.
       * @param {Object} a First element to compare.
       * @param {Object} b Second element to compare.
       * @return {Boolean} boolean indicating the predicate outcome.
       */
      function sortByDate(a, b) {
        // Compare the individuals based on participation date
        //(no need to compare when there is only 1 summary)
        var aNum = a.name.substr(a.name.lastIndexOf('(') + 1, 4);
        var bNum = b.name.substr(b.name.lastIndexOf('(') + 1, 4);
        // Sort by date, name, id.
        return d3.ascending(aNum, bNum) ||
          d3.ascending(a.name, b.name) ||
          d3.ascending(a.id, b.id);
      }
    }
  }
}



// WEBPACK FOOTER //
// ./src/assets/js/treeChart.js
